// 请求接口
import axios from "axios"
// qs：在登陆时axios请求数据传参时无法正常的获取数据，原因是传递参数序列化
// qs.stringify()时将对象序列化成URL的形式，以&进行拼接
// qs.stringify({name:''Tom',age:23})结果是"name=Tom&age=23"
// qs。stringify(name=Tom&age=23)结果是{name:'Tom',age:23}
import qs from "qs"
// 使用create方法创建axios实例，根据指定配置创建一个新的axios
const http = axios.create({
    // timeout：7000，//请求超时间
    baseURL: "http",//默认路径
    /*headers:{'Content-Type'：'application/json;chanrset=UTF - 8'}//请求第一种方式  这个看后端解析内容的方式*/
});
// axios.defaults.headers.post['Content-Type']='application/x-www-from-urlencoded;charset=UTF-8';//请求第二种方式这个看后端解析内容的方式
/*第一：请求拦截器  我们再发送请求钱可以进行一个请求的拦截，为什么要拦截？拦截做什么？
比如，有些请求是要用户进行登录后才能进行访问的 或者post请求的时候，
我们需要序列化我们提交的数据。这时候，我们可以在请求被发送前进行一个拦截，从而进行我们想要的操作。 */

/* 这里说一下token，一般是在登录完成之后，将用户的token通过localStorage或者cookie存在本地，然后用户每次在进入页面的时候（即在main.js中），
会首先从本地存储中读取token，如果token存在说明用户已经登陆过，则更新vuex中的token状态。
然后，在每次请求接口的时候，都会在请求的header中携带token，
后台人员就可以根据你携带的token来判断你的登录是否过期，如果没有携带，则说明没有登录过。*/
http.interceptors.request.use((config) => {
    if (config.method == 'post') {
        // 添加一些公共字段
        // config.data['roleId]='共同的字段'
        config.data = qs.stringify(config.data)//序列化
    }
    if (config.method == 'get') {
        // 这里面进行操作
    }
    return config;
}, (error) => {
    //对请求错误做些什么 方法返回一个带有拒绝原因(error)的Promise对象。
    return Promise.reject(error)
});
/*响应拦截器  就是服务器返回给我们的数据，在拿到之前可以对他进行一些处理。
例如上面的思想：如果后台返回的状态码是200，则返回正常数据，否则的根据错误的状态码类型进行一些我们需要的错误，
其实这里主要就是进行了错误的统一处理和没登录或登录过期后调整登录页的一个操作。 */
http.interceptors.response.use((response) => {
    // 对响应数据做点什么
    console.log(response);
    const status = response.data.status;
    if (response.status == 200) {
        // console.log(response.data.data);
        return response.data.data.rows
    } else {
        return response.data
    }
}, (error) => {
    //对响应错误做点什么
    return Promise.reject(error)
});
export default http;